<template>
	<el-menu
	  :default-active="activeIndex2"
	  class="el-menu-demo"
	  mode="horizontal"
	  @select="handleSelect"
	  background-color="#545c64"
	  text-color="#fff"
	  active-text-color="#ffd04b">
	  <el-menu-item index="1">处理中心</el-menu-item>
	  <el-submenu index="2">
	    <template slot="title">我的工作台</template>
	    <el-menu-item index="2-1">待处理</el-menu-item>
<!-- 	    <el-menu-item index="2-2">选项2</el-menu-item>
	    <el-menu-item index="2-3">选项3</el-menu-item> -->
	    <el-submenu index="2-4">
<!-- 	      <template slot="title">选项4</template>
	      <el-menu-item index="2-4-1">选项1</el-menu-item>
	      <el-menu-item index="2-4-2">选项2</el-menu-item>
	      <el-menu-item index="2-4-3">选项3</el-menu-item> -->
	    </el-submenu>
	  </el-submenu>
	  <el-menu-item index="3" disabled>消息中心</el-menu-item>
	  <el-menu-item index="4"><a href="#" target="_blank">订单管理</a></el-menu-item>
	</el-menu>
</template>

<script>
	export default {
		name: "top_head",
		data() {
		  return {
			activeIndex: '1',
			activeIndex2: '1'
		  };
		},
		methods: {
		  handleSelect(key, keyPath) {
			console.log(key, keyPath);
		  }
		}
	}
</script>

<style scoped>
	*{top:0; bottom:0; margin: 0; padding:0; left: 0; right: 0;}
	.top_head{
		height: 100px;
		width: 88%;
		float: left;
		border-bottom: 1px solid #E1E3E1;
		border-top: 1px solid #E1E3E1;
	}
	.navigation{
		width:100%;

		float: left;
		height:35%;
		line-height: 210%;
		border-top: 1px solid #E1E3E1;
	}
	.head_title_info{
		float:left; width:100%;
		height:66%;
		line-height: 390%;
	}
	.head_title_user_info{
		float: right;
		width: 5%;
	}
	.admin_head_img{
		float: right;
		border-radius: 50%;
		margin-right: 1%;
		line-height: 390%;
		margin-top: 0.5%;
	}
</style>